<template>
  <div>
    <!-- 顶部 -->
    <div class="top flex">
      <el-input v-model="data.keydown" placeholder="请输入内容" class="inp">
        <template #append>
          <el-button :icon="Search">搜索</el-button>
        </template>
      </el-input>
      <el-button
        type="primary"
        :icon="Edit"
        @click="$router.push('/centralPoint/addand')"
        >添加</el-button
      >
    </div>
    <!-- 表格 -->
    <el-table
      ref="multipleTableRef"
      :data="data.list"
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column property="name" label="用户名"> </el-table-column>
      <el-table-column property="updatedAt" label="更新时间">
        <template v-slot="{ row }"> </template>
      </el-table-column>
      <el-table-column property="status" label="状态">
        <template v-slot="{ row }">
          <el-tag class="ml-2" type="success" v-if="row.status">开启</el-tag>
          <el-tag class="ml-2" type="info" v-else>停用</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template v-slot="{ row }">
          <el-button
            plain
            @click="$router.push('/centralPoint/update/' + row.id)"
            >编辑</el-button
          >
            <el-button type="danger" plain>修改</el-button>
          <el-button type="danger" plain>删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <el-pagination
      small
      background
      layout="prev, pager, next"
      :total="data.total"
      class="mt-4"
    />
  </div>
</template>
<script setup lang="ts">
import store from "@/store/index";
import { ref, reactive, onMounted } from "vue";
import { Search, Edit } from "@element-plus/icons-vue";
import dayjs from "dayjs";
import { baseURL } from "@/uitils/env";
import { getUser } from "@/api/user_api";
const data: any = reactive({
  page: 1,
  limit: 10,
  total: 0,
});
onMounted(() => {
  getUser({ page: data.page, limit: data.limit }).then((res): any => {
    console.log(res);
    data.list = res.data.map((item: any) => {
      item.updatedAt = dayjs(item.updatedAt).format("YYYY-MM-DD hh:mm:ss");
      return item;
    });
  });
});
</script>
<style lang='scss' scoped>
</style>